import { Button, Card, Form, Input, Space, message } from "antd";
import Crypto from "crypto-js";
import { useState } from "react";
import { writeText } from '@tauri-apps/api/clipboard';

function HashPanel() {
    const [md5Str, setMd5Str] = useState(Crypto.MD5("").toString());
    const [sha1Str, setSha1Str] = useState(Crypto.SHA1("").toString());
    const [sha224Str, setSha224Str] = useState(Crypto.SHA224("").toString());
    const [sha256Str, setSha256Str] = useState(Crypto.SHA256("").toString());
    const [sha512Str, setSha512Str] = useState(Crypto.SHA512("").toString());

    return (
        <Card title="Hash编码" bordered={false} bodyStyle={{ height: "calc(100vh - 100px)", overflowY: "auto" }}>
            <h3>源内容</h3>
            <Input.TextArea rows={6} onChange={e => {
                e.stopPropagation();
                e.preventDefault();
                setMd5Str(Crypto.MD5(e.target.value).toString());
                setSha1Str(Crypto.SHA1(e.target.value).toString());
                setSha224Str(Crypto.SHA224(e.target.value).toString());
                setSha256Str(Crypto.SHA256(e.target.value).toString());
                setSha512Str(Crypto.SHA512(e.target.value).toString());
            }} />
            <h3>hash值</h3>
            <Form labelCol={{ span: 3 }}>
                <Form.Item label="md5">
                    <Space>
                        <Button onClick={e => {
                            e.stopPropagation();
                            e.preventDefault();
                            writeText(md5Str).then(() => message.info("复制成功"));
                        }}>复制</Button>
                        {md5Str}
                    </Space>
                </Form.Item>
                <Form.Item label="sha1">
                    <Space>
                        <Button onClick={e => {
                            e.stopPropagation();
                            e.preventDefault();
                            writeText(sha1Str).then(() => message.info("复制成功"));
                        }}>复制</Button>
                        {sha1Str}
                    </Space>
                </Form.Item>
                <Form.Item label="sha224">
                    <Space>
                        <Button onClick={e => {
                            e.stopPropagation();
                            e.preventDefault();
                            writeText(sha224Str).then(() => message.info("复制成功"));
                        }}>复制</Button>
                        {sha224Str}
                    </Space>
                </Form.Item>
                <Form.Item label="sha256">
                    <Space>
                        <Button onClick={e => {
                            e.stopPropagation();
                            e.preventDefault();
                            writeText(sha256Str).then(() => message.info("复制成功"));
                        }}>复制</Button>
                        {sha256Str}
                    </Space>
                </Form.Item>
                <Form.Item label="sha512">
                    <Space>
                        <Button onClick={e => {
                            e.stopPropagation();
                            e.preventDefault();
                            writeText(sha512Str).then(() => message.info("复制成功"));
                        }}>复制</Button>
                        {sha512Str}
                    </Space>
                </Form.Item>
            </Form>
        </Card>
    );
}

export default HashPanel;